<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>Lobster.js</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <!-- LayUI需要引用下面两个文件 -->
    <link href="/lobsteruiframe/layuiadmin/layui/css/layui.css" rel="stylesheet" />
    <script src="/lobsteruiframe/layuiadmin/layui/layui.js"></script>
    <!-- 富文本编辑需要引用下面两个文件 -->
    <script src="/lobsteruiframe/ueditor/ueditor.config.js"></script>
    <script src="/lobsteruiframe/ueditor/ueditor.all.js"></script>
    <script src="/jslib/jquery-3.4.1.min.js"></script>
    <!-- OSS需要引用此文件 -->
    <script src="/jslib/aliyun-oss-sdk.min.js"></script>
    <!-- 富文本控件导入word需要引用此文件 -->
    <script src="/jslib/importword/mammoth.browser.min.js"></script>


    <!-- <script src="/lobstersdk/lobster.js"></script> -->
    <script src="/jslib/lobster.js"></script>

</head>

<body style="padding-left: 10px;">
    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
        <legend>获取WorkId、AppId、SSOUserId</legend>
    </fieldset>

    <div class="layui-card" style="margin-top: 10px;">
        <div>
            <blockquote id="txtWorkId" class="layui-elem-quote layui-quote-nm">引用区域的文字</blockquote>
        </div>
    </div>

    <div class="layui-btn-container" style="margin-top: 10px;">
        <button class="layui-btn" id="btnWorkId">退出</button>
    </div>

    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
        <legend>1、测试调用应用订阅的服务</legend>
    </fieldset>

    <pre class="layui-code">
        //获取用户信息
        lobsterlayui.CALLOUTSERVICE("sso.mpuser.getmpuserinfo", { userId: 1630287796 }).then(res => {
            var userinfo = res.user[0];
            console.log(userinfo);
        })
    </pre>

    <div class="layui-btn-container" style="margin-top: 10px;">
        <button class="layui-btn" id="testservice">执行</button>
    </div>

    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
        <legend>2、测试文件上传到OSS</legend>
    </fieldset>

    <pre class="layui-code">
        //上传文件
        lobsterlayui.OSSUploadFile('#multipartFile', function (res) {
            console.log(res);
            self.data.$layui.element.progress('progress', Math.round(res * 100) + '%');
        }, function (res) {
            console.log(res);
            $("#fileurl").text(res.url);
        })
    </pre>

    <div class="layui-card">
        <input type="file" id="multipartFile" class="layui-btn">
        <div class="layui-progress layui-progress-big" lay-filter="progress" lay-showPercent="true">
            <div class="layui-progress-bar layui-bg-blue" lay-percent="0%"></div>
        </div>

        <div>文件上传后路径：<span id="fileurl"></span></div>
    </div>

    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
        <legend>3、测试富文本编辑</legend>
    </fieldset>

    <pre class="layui-code">
        //测试富文本编辑
        var ue = UE.getEditor('content');
        ue.ready(function () {
            ue.execCommand('serverparam', {
                'workId': 1,
            });
            ue.setShow();
        });
        lobsterlayui.ImportWord.init("document", 'APP20210329185258876', '2052', (result) => {
            //document.getElementById("output").value = result.value;
            ue.ready(function () {
                ue.setContent(result.value);
            });
        });
    </pre>

    <div class="layui-card">
        <form class="layui-form layui-card-body">
            <div class="layui-form-item">
                <label class="layui-form-label">导入文档</label>
                <div class="layui-input-block">
                    <input id="document" type="file" class="layui-btn" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">内容</label>
                <div class="layui-input-block">
                    <script id="content" style="width:100%;height:500px;" name="content" type="text/plain">
                    </script>
                </div>
            </div>
        </form>
    </div>

</body>

</html>

<script type="text/javascript">
    lobsterlayui.main(['index', 'layer', 'form', 'element'], {
        data: {
            $layui: null
        },
        pageload: function () {
            var self = this;

            $('#txtWorkId').html('WorkId:' + lobsterlayui.GetWorkId() + '<br>'
                + 'AppId:' + lobsterlayui.GetAppId() + '<br>'
                + 'GetAppKey:' + lobsterlayui.GetAppKey() + '<br>'
                + 'SSOUserId:' + lobsterlayui.GetSSOUserId() + '<br>'
                + 'SSOToken:' + lobsterlayui.GetSSOToken() + '<br>'
            );
            lobsterlayui.GetSystemConfigs(1, 11, 'AppID').then((data) => {
                $('#txtWorkId').append('系统参数:' + JSON.stringify(data) + '<br>');
            });
            lobsterlayui.GetBaseDict(1001).then((data) => {
                $('#txtWorkId').append('平台基础字典:' + JSON.stringify(data) + '<br>');
            });
            lobsterlayui.GetAppBaseDict(3052, 1001).then((data) => {
                $('#txtWorkId').append('应用基础字典:' + JSON.stringify(data) + '<br>');
            });

            lobsterlayui.GET('/lowcode/GetAppKey',{appid:10}).then((res)=>{
                console.log(res);
            });

            $('#btnWorkId').on('click', function () { //监听按钮事件
                lobsterlayui.ExitLogin();
                $('#txtWorkId').html('');
            });

            $('#testservice').on('click', function () { //监听按钮事件
                lobsterlayui.CALLOUTSERVICE("sso.mpuser.getmpuserinfo", { userId: 1630287796 }).then(res => {
                    var userinfo = res.user[0];
                    console.log(userinfo);
                })
            });

            //测试文件上传
            lobsterlayui.OSSUploadFile('#multipartFile', function (res) {
                console.log(res);
                self.data.$layui.element.progress('progress', Math.round(res * 100) + '%');
            }, function (res) {
                console.log(res);
                $("#fileurl").text(res.url);
            })

            //测试富文本编辑
            var ue = UE.getEditor('content');
            ue.ready(function () {
                ue.execCommand('serverparam', {
                    'workId': 1,
                });
                ue.setShow();
            });
            lobsterlayui.ImportWord.init("document", 'APP20210329185258876', '2052', (result) => {
                //document.getElementById("output").value = result.value;
                ue.ready(function () {
                    ue.setContent(result.value);
                });
            });
        }
    });

</script>